<template>
  <div class="app-container">
    <div class="qrCodeContainer" style="width: 450px; height: 50px; display: none; width: 100%">
      <h1 class="title" style="width: 500px; margin-left: 35%; font-size: 20px">{{ $t(`Print.Fujian`) }}:{{ factoryName }}:{{ $t(`Print.FootwearCoLtdLargeBottomWarehouseWarehousingList`) }}</h1>
      <div style="width: 95%; margin: auto">
        <div style="display: flex; width: 100%; font-size: 13px; justify-content: space-between">
          <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.DeliveryUnits`) }}:{{ slipNoList3?.deptName }}</h2>
          <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.DeliveryNoteNumber`) }}:{{ slipNoList3?.sendNo }}</h2>
          <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.DeliveryDate`) }}:{{ slipNoList3?.slipDate }}</h2>
          <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.DocumentNumber`) }}:{{ slipNoList3?.printNo }}</h2>
        </div>

        <div style="width: 100%">
          <table style="width: 100%; font-size: 13px">
            <thead>
              <tr>
                <th class="lotNo" style="width: 20% !important">{{ $t(`Print.Directives`) }}</th>
                <th style="width: 10%">{{ $t(`Print.EvenTheNumberOfInboundWarehousing`) }}</th>
                <th>{{ $t(`Print.DepositDetails`) }}</th>
              </tr>
            </thead>
            <tbody>
              <tr v-for="(iten1, index) in slipNoList3?.details" :key="index">
                <td style="width: 20% !important">{{ iten1.lotNo }}</td>

                <td>{{ iten1.total }}</td>

                <td style="padding: 0 !important">
                  <div style="height: 100%; text-align: left; font-size: 10px; display: flex; flex-direction: column; justify-content: space-between">
                    <div style="display: flex; align-items: center">
                      <p style="margin: 0; padding-right: 5px; width: 30px">{{ $t(`Print.Number`) }}</p>
                      <p style="border-right: 1px solid; height: 15px; margin: 0"></p>
                      <span
                        v-for="(item, itemIndex) in iten1.items"
                        :key="itemIndex"
                        style="
                          margin: 0 15px;
                          border-right: 1px solid;
                          height: 15px;
                          margin: 0;
                          text-align: center;
                          width: 40px !important;
                          text-align: center;
                          &:nth-last-child() {
                            border: none;
                          }
                          width: 25px;
                        "
                        >{{ item.size }}</span
                      >
                    </div>

                    <p style="border-bottom: 1px solid; margin: 0px 0"></p>

                    <div style="display: flex; align-items: center">
                      <p style="margin: 0; padding-right: 5px; width: 30px">{{ $t(`Print.Quantity`) }}</p>
                      <p style="border-right: 1px solid; height: 20px; margin: 0"></p>
                      <span
                        v-for="(item, itemIndex) in iten1.items"
                        :key="itemIndex"
                        style="
                          margin: 0 5px;
                          border-right: 1px solid;
                          height: 15px;
                          margin: 0;
                          text-align: center;
                          width: 40px !important;
                          text-align: center;
                          &:nth-last-child() {
                            border: none;
                          }
                          width: 25px;
                        "
                        >{{ item.num }}</span
                      >
                    </div>
                  </div>
                </td>
                <!-- 更多的数据单元格 -->
              </tr>

              <!-- <tr>
                <td >
                  <div style="display: flex; align-items: center; justify-content: center; height: 100%">
                    <span>号码</span>
                    <span style="height: 25px; border-left: 1px solid; margin-left: 5px; margin-right: 5px" class="parent"></span>
                    <span>数量</span>
                  </div>
                </td>
            </tr> -->
              <!-- 更多的行 -->
            </tbody>
            <!-- 可选的 tfoot 部分 -->
          </table>

          <!-- <Table :tableHeader="tableHeader5" :tableData="slipNoList" /> -->
        </div>

        <div style="display: flex; justify-content: space-between; width: 85%; font-size: 17px; width: 80%; margin: auto">
          <h2 style="font-size: 13px">>{{ $t(`Print.Deliveryman`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.QualityControlDepartment`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.WarehouseKeeper`) }}:{{ slipNoList3?.sysUser }}</h2>
        </div>
      </div>
    </div>

    <Find @handleBlur="selectVal" :OriginalFilter="{ static: true }" :formList="formList1" @findClicked="findData" @Launchform="Launchform" />

    <el-card style="margin-top: 10px" shadow="always" :body-style="{ padding: '5px' }">
      <div>
        <div>
          <h1 style="color: red">{{ $t(`Print.ReceivingDetails`) }}</h1>
          <qiTable style="margin-left: 160px" :tableHeader="tableHeader2" :tableData="tableHeaderList5" :TableHeight="16" :outTableHeight="150" />
          <qiTable
            @selectV2Change="selectValChange"
            @currentRow="currentRowList"
            @inputChange="confirmChange"
            :tableHeader="tableHeader"
            :tableData="TableDateListMaterials.inDtos"
            :TableHeight="50"
            :outTableHeight="150"
          />
          <qiTable :tableHeader="tableHeader5" :tableData="tableHeaderList" :TableHeight="25" :outTableHeight="150" />
        </div>
        <div>
          <h1 style="color: blue">{{ $t(`Print.IssueDetails`) }}</h1>
          <qiTable style="margin-left: 80px" :tableHeader="tableHeader2" :tableData="tableHeaderList5" :TableHeight="16" :outTableHeight="150" />
          <qiTable
            @currentRow="currentRowList1"
            @selectListShow="selectListShow1"
            @selectValChange="selectValChange1"
            @inputChange="confirmChange1"
            :tableHeader="tableHeader6"
            :tableData="TableDateListMaterials.outDtos"
            :TableHeight="50"
            :outTableHeight="150"
          />
          <qiTable :tableHeader="tableHeader3" :tableData="tableHeaderList1" :TableHeight="25" :outTableHeight="150" />
        </div>
      </div>
    </el-card>

    <el-dialog width="20%" v-model="dialogVisible" :title="$t(`Print.CommandSelection`)">
      <qiTable
        @currentRow1="currentRowList2"
        :tableHeader="tableHeader7"
        :tableData="tableHeader7TableDate"
        :TableHeight="22"
        :outTableHeight="150"
      />
    </el-dialog>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import LoginWork from '@/utils/LoginWork'
import { VendorData1 } from '@/api/WarehouseDepartment/FactoryStorage/TemporaryReceiptStorage'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'InputInsoleReceivingIssuingMaterials'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ref, onMounted } from 'vue'
import {
  ReceivingUnitQuery,
  DeleteTheCurrentRowData,
  InsoleSendingAndReceivingQuery,
  AddedAllIncomingMaterials,
  GetVendorList,
  JudgmentInstruction,
  lotNoQuery,
  GenerateDocumentNumber,
  printDate
} from '@/api/WarehouseDepartment/FactoryStorage/InputInsoleReceivingIssuingMaterials'
import type {
  GetVendorListListParms,
  MaterialsReceivedAndIssuedInquiriesInterface,
  AddedAllIncomingMaterialsParms
} from '@/api/WarehouseDepartment/FactoryStorage/InputInsoleReceivingIssuingMaterials'

// 通过sessionStorage获取工厂名称
const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}')
const factoryName = userInfo.abbrName
// 打印数据
const printDateMethodsLotNo = ref('')

const slipNoList3 = ref<any>()

const printDateMethods = async () => {
  try {
    const result = await printDate(printDateMethodsLotNo.value)
    if (result.code === 200) {
      slipNoList3.value = result.data
      setTimeout(() => {
        printQRCode()
      }, 10)

      JMessage.success(result.message)
    } else {
      JMessage.error(result.message)
    }
  } catch (error) {
    JMessage.error('打印数据失败请重试')
  }
}

const printQRCode = () => {
  const qrCodeContainer = document.querySelector<any>('.qrCodeContainer')
  if (qrCodeContainer) {
    // 临时显示 .qrCodeContainer 以获取其内容
    qrCodeContainer.style.display = 'block'

    const printWindow = window.open('', '_blank')
    printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印指令领料作业</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            @page {
              size: auto; 
              margin: 3mm;
            }
            @media print {
                /* 打印时的样式 */
          
                
                /* 其他打印样式 */
            }
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
                }
            h3{
              font-size:13px;
            }
              

            table, th, td {
                    border: 1px solid black; 
                    border-collapse: collapse; 
                    text-align: center;
                  }
                  th, td {
                    padding: 5px; /* 设置内边距 */
                    text-align: left; /* 设置文本对齐方式 */
                    text-align: center;
                    font-size:11px
                  }
                  .double-line {
                    border-top: 2px dashed red; 
                    border-bottom: 2px dashed red; 
                    text-align: center;
                  }
           
            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

    // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
    const cloneContainer = qrCodeContainer.cloneNode(true)
    printWindow!.document.body.appendChild(cloneContainer)

    printWindow!.document.write(`
        </body>
      </html>
    `)
    printWindow!.document.close()

    // 开始打印
    printWindow!.print()

    // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
    qrCodeContainer.style.display = 'none'
  }
}

// 生成单据号
const GenerateDocumentNumberMethodsLotNo = ref('')

const GenerateDocumentNumberMethods = async () => {
  try {
    const result = await GenerateDocumentNumber(GenerateDocumentNumberMethodsLotNo.value)
    if (result.code === 200) {
      InsoleSendingAndReceivingQueryMethods()
      JMessage.success(result.message)
    } else {
      JMessage.error(result.message)
    }
  } catch (error) {
    JMessage.error('获取打印数据失败')
  }
}

// 指令查询

const tableHeader7TableDate = ref([])

const currentRowList2 = (row: any) => {
  formList1.value[0].inputValue = row.lotNo
  dialogVisible.value = false
}

const lotNoQueryMethods = async () => {
  const result = await lotNoQuery(lotNoList.value)
  tableHeader7TableDate.value = result.map((item: any) => {
    return { lotNo: item }
  })
}

const dialogVisible = ref(false)

const lotNoList = ref('')

// 判断指令是否存在
const selectVal = (row: any) => {
  lotNoList.value = row
  JudgmentInstructionMethods()
}

const JudgmentInstructionMethods = async () => {
  if (lotNoList.value !== '') {
    const result = await JudgmentInstruction(lotNoList.value)
    if (result.code === 200) {
    } else {
      lotNoQueryMethods()
      dialogVisible.value = true
    }
  }
}

const formList1 = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: ''
  },
  {
    type: 'input1',
    inputLabel: '型体',
    inputDisabled: true
  },
  {
    type: 'input1',
    inputLabel: '颜色',
    inputDisabled: true
  },
  {
    type: 'input1',
    inputLabel: '交期',
    inputDisabled: true
  },
  {
    type: 'input',
    inputLabel: '数量',
    inputDisabled: true
  },
  {
    type: 'radio1',
    checkboxLabel: '入库',
    checked: true,
    label: '0'
  },
  {
    type: 'radio1',
    checkboxLabel: '出库',
    checked: true,
    label: '1'
  },
  {
    type: 'button',
    checkboxLabel: '打印指令出入库单据'
  },
  {
    type: 'button',
    checkboxLabel: '新增收料'
  },
  {
    type: 'button',
    checkboxLabel: '全部收料'
  },
  {
    type: 'button',
    checkboxLabel: '新增全部发料'
  },
  {
    type: 'button',
    checkboxLabel: '全部发料'
  },
  {
    type: 'button',
    checkboxLabel: '查询'
  },
  {
    type: 'button',
    checkboxLabel: '删除当前行数据'
  },
  {
    type: 'button',
    checkboxLabel: '获取打印数据'
  }
])

const tableHeaderList5 = ref<any>([
  {
    label: '客户号码'
  },
  {
    label: '鞋垫号码'
  }
])

const currentRowListOnet = ref()

const findData = (count: any) => {
  if (count === '打印指令出入库单据') {
    printDateMethods()
  }
  if (count === '获取打印数据') {
    if (GenerateDocumentNumberMethodsLotNo.value === '') {
      JMessage.warning('指令不可为空')
    } else {
      GenerateDocumentNumberMethods()
    }
  }
  if (count === '查询') {
    InsoleSendingAndReceivingQueryMethods()
    tableHeaderList5.value[0] = { label: '客户号码' }
    tableHeader2.value = [
      {
        label: '',
        prop: 'label',
        width: '80'
      }
    ]
  }
  if (count === '新增收料') {
    if (MaterialsReceivedAndIssuedInquiriesMethdosTableDateList.value === '') {
      JMessage.warning('请先输入指令查询在进行新增')
    } else {
      GetVendorListMethods()
      activeList.value = 1
      ;(AddedAllIncomingMaterialsMehtodsPamrs.value.deptName = {
        selectValue: '',
        options: [],
        PageModule: true,
        total: totalList,
        handleSizeChange: (val: any) => {
          GetVendorListListParmsMethods.value.pageNum = val
          GetVendorListMethods()
        },
        handleCurrentChange: (val: any) => {
          GetVendorListListParmsMethods.value.pageNum = val
          GetVendorListMethods()
        }
      }),
        (AddedAllIncomingMaterialsMehtodsPamrs.value.slipType = 'I')
      TableDateListMaterials.value.inDtos.push(AddedAllIncomingMaterialsMehtodsPamrs.value as any)
    }
  }
  if (count === '删除当前行数据') {
    if (deleteAddListMethodsParms.value === '') {
      JMessage.warning('请选择需要删除的数据')
    } else {
      handleCloseMateriaLKlc5()
    }
  }

  if (count === '全部收料') {
    let active: boolean = false
    if (currentRowListOnet.value === undefined) {
      JMessage.warning('请选择需要全部收料的行数据')
    } else {
      for (let i = 1; i <= 26; i++) {
        if (currentRowListOnet.value['qty' + i] !== null) {
          active = true
        }
      }
      if (active) {
        JMessage.warning('请选择新增的数据进行全部收料')
      } else {
        for (let i = 0; i <= 26; i++) {
          currentRowListOnet.value['qty' + i] = tableHeaderList.value[1]['num' + i]
        }
        confirmChange(currentRowListOnet.value)
      }
    }
  }

  if (count === '新增全部发料') {
    if (MaterialsReceivedAndIssuedInquiriesMethdosTableDateList.value === '') {
      JMessage.warning('请先输入指令查询在进行新增')
    } else {
      GetVendorListMethods()
      activeList.value = 1
      AddedAllIncomingMaterialsMehtodsPamrsOut.value.slipType = 'O'
      TableDateListMaterials.value.outDtos.push(AddedAllIncomingMaterialsMehtodsPamrsOut.value as any)
    }
  }

  if (count === '全部发料') {
    let active: boolean = false
    if (currentRowListOnet1.value === undefined) {
      JMessage.warning('请选择需要全部收料的行数据')
    } else {
      for (let i = 1; i <= 26; i++) {
        if (currentRowListOnet1.value['qty' + i] !== null) {
          active = true
        }
      }

      for (let i = 0; i <= 26; i++) {
        currentRowListOnet1.value['qty' + i] = tableHeaderList1.value[1]['num' + i]
      }
      confirmChange1(currentRowListOnet1.value)
    }
  }
}

const tableHeaderList = ref<any>([
  {
    label: '收料合计',
    num1: '',
    num2: '',
    num3: '',
    num4: '',
    num5: '',
    num6: '',
    num7: '',
    num8: '',
    num9: '',
    num10: '',
    num11: '',
    num12: '',
    num13: '',
    num14: '',
    num15: '',
    num16: '',
    num17: '',
    num18: '',
    num19: '',
    num20: '',
    num21: '',
    num22: '',
    num23: '',
    num24: '',
    num25: '',
    num26: '',
    num27: '',
    num28: '',
    num29: ''
  },
  {
    label: '收料欠数',
    num1: '',
    num2: '',
    num3: '',
    num4: '',
    num5: '',
    num6: '',
    num7: '',
    num8: '',
    num9: '',
    num10: '',
    num11: '',
    num12: '',
    num13: '',
    num14: '',
    num15: '',
    num16: '',
    num17: '',
    num18: '',
    num19: '',
    num20: '',
    num21: '',
    num22: '',
    num23: '',
    num24: '',
    num25: '',
    num26: '',
    num27: '',
    num28: '',
    num29: ''
  }
])

const currentRowListOnet1 = ref()

const currentRowList1 = (row: any) => {
  const { slipNo } = row
  deleteAddListMethodsParms.value = slipNo
  currentRowListOnet1.value = row
  console.log(currentRowListOnet1.value)
}

const tableHeaderList1 = ref<any>([
  {
    label: '发料合计',
    num1: '',
    num2: '',
    num3: '',
    num4: '',
    num5: '',
    num6: '',
    num7: '',
    num8: '',
    num9: '',
    num10: '',
    num11: '',
    num12: '',
    num13: '',
    num14: '',
    num15: '',
    num16: '',
    num17: '',
    num18: '',
    num19: '',
    num20: '',
    num21: '',
    num22: '',
    num23: '',
    num24: '',
    num25: '',
    num26: '',
    num27: '',
    num28: '',
    num29: ''
  },
  {
    label: '发料欠数',
    num1: '',
    num2: '',
    num3: '',
    num4: '',
    num5: '',
    num6: '',
    num7: '',
    num8: '',
    num9: '',
    num10: '',
    num11: '',
    num12: '',
    num13: '',
    num14: '',
    num15: '',
    num16: '',
    num17: '',
    num18: '',
    num19: '',
    num20: '',
    num21: '',
    num22: '',
    num23: '',
    num24: '',
    num25: '',
    num26: '',
    num27: '',
    num28: '',
    num29: ''
  },
  {
    label: '库存数量',
    num1: '',
    num2: '',
    num3: '',
    num4: '',
    num5: '',
    num6: '',
    num7: '',
    num8: '',
    num9: '',
    num10: '',
    num11: '',
    num12: '',
    num13: '',
    num14: '',
    num15: '',
    num16: '',
    num17: '',
    num18: '',
    num19: '',
    num20: '',
    num21: '',
    num22: '',
    num23: '',
    num24: '',
    num25: '',
    num26: '',
    num27: '',
    num28: '',
    num29: ''
  }
])

onMounted(() => {
  GetVendorListMethods()

  ReceivingUnitQueryMethods()
})

const currentDate = ref(new Date())

const formatCurrentDate = (date?: Date) => {
  const year = date!.getFullYear()
  const month = (date!.getMonth() + 1).toString().padStart(2, '0') // 确保月份是两位数
  const day = date!.getDate().toString().padStart(2, '0') // 确保日期是两位数
  return `${year}-${month}-${day}`
}

const slipDate = formatCurrentDate(currentDate.value)

const AddedAllIncomingMaterialsMehtodsPamrsOut = ref<AddedAllIncomingMaterialsParms>({
  lotNo: '',
  deptNo: { selectValue: '', options: [] },
  deptName: {},
  slipDate: slipDate,
  qty1: '',
  qty2: '',
  qty3: '',
  qty4: '',
  qty5: '',
  qty6: '',
  qty7: '',
  qty8: '',
  qty9: '',
  qty10: '',
  qty11: '',
  qty12: '',
  qty13: '',
  qty14: '',
  qty15: '',
  qty16: '',
  qty17: '',
  qty18: '',
  qty19: '',
  qty20: '',
  qty21: '',
  qty22: '',
  qty23: '',
  qty24: '',
  qty25: '',
  qty26: '',
  remark: '',
  sendNo: '',
  slipNo: '',
  slipType: '',
  change: true,
  disableConfirm: true
})

// 领用单位查询
const ReceivingUnitQueryMethodsParmsList = ref([])

const ReceivingUnitQueryMethods = async () => {
  let NewArray = []
  const result = await ReceivingUnitQuery()
  NewArray = result.reduce((arr: any, item: any) => {
    if (item.deptId && item.deptName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.deptId + ' ' + item.deptName)
    }
    return arr
  }, [])
  ReceivingUnitQueryMethodsParmsList.value = EvaluatesTheArrayReturnValue(NewArray)
  AddedAllIncomingMaterialsMehtodsPamrsOut.value.deptNo.options = EvaluatesTheArrayReturnValue(NewArray)
}

const confirmChange1 = async (row?: any) => {
  row.deptNo = row.deptNo.selectValue.split(' ')[1]
  row.lotNo = MaterialsReceivedAndIssuedInquiriesMethdosTableDateList.value

  for (let i = 1; i <= 26; i++) {
    if (typeof row['qty' + i] === 'string') {
      row['qty' + i] = Number(row['qty' + i])
    }
  }

  const result = await LoginWork.put<any, any>(`/pcFactorStockQuery/soleXDIOUp`, row)
  if (result.code === 200) {
    InsoleSendingAndReceivingQueryMethods()
    JMessage.success(result.message)
  } else {
    InsoleSendingAndReceivingQueryMethods()
    JMessage.error(result.message)
  }

  tableHeaderList5.value[0] = { label: '客户号码' }
  tableHeader2.value = [
    {
      label: '',
      prop: 'label',
      width: '80'
    }
  ]
}

const selectListShow1 = (row?: any, visible?: boolean) => {
  if (visible === true) {
    if (row !== undefined) {
      if (row !== undefined) {
        row.deptNo = {
          selectValue: row.deptNo.selectValue,
          options: ReceivingUnitQueryMethodsParmsList.value
        }
      }
    }
  } else {
    if (row.deptNo === Object) {
      row.deptNo.options = []
    }
  }
}

const selectValChange1 = async (row: any) => {
  if (activeList.value === 1) {
    for (let i = 1; i <= 26; i++) {
      if (row['qty' + i] !== '') {
        row['qty' + i] = Number(row['qty' + i])
      }
    }
    let rowList = row.deptNo.selectValue.split(' ')
    row.deptName = rowList[1]
    row.deptNo = rowList[0]
    AddedAllIncomingMaterialsMehtodsI()
  } else {
    tableHeaderList5.value[0] = { label: '客户号码' }
    tableHeader2.value = [
      {
        label: '',
        prop: 'label',
        width: '80'
      }
    ]
    let rowList = row.deptNo.selectValue.split(' ')
    row.deptName = rowList[1]
    row.deptNo = rowList[0]
    for (let i = 1; i <= 26; i++) {
      if (typeof row['qty' + i] === 'string') {
        row['qty' + i] = Number(row['qty' + i])
      }
    }

    const result = await LoginWork.put<any, any>(`/pcFactorStockQuery/soleXDIOUp`, row)
    if (result.code === 200) {
      InsoleSendingAndReceivingQueryMethods()
      JMessage.success(result.message)
    } else {
      InsoleSendingAndReceivingQueryMethods()
      JMessage.error(result.message)
    }

    tableHeaderList5.value[0] = { label: '客户号码' }
    tableHeader2.value = [
      {
        label: '',
        prop: 'label',
        width: '80'
      }
    ]
  }
}

const AddedAllIncomingMaterialsMehtodsI = async () => {
  const result = await AddedAllIncomingMaterials(AddedAllIncomingMaterialsMehtodsPamrsOut.value, TableDateListMaterials.value.size.length)
  if (result.code === 200) {
    InsoleSendingAndReceivingQueryMethods()
    activeList.value = 0
    JMessage.success(result.message)
  } else {
    InsoleSendingAndReceivingQueryMethods()
    activeList.value = 0
    JMessage.error(result.message)
  }
}

// 删除当前行数据
const currentRowList = (row: any) => {
  const { slipNo, printNo } = row
  deleteAddListMethodsParms.value = slipNo
  currentRowListOnet.value = row
  printDateMethodsLotNo.value = printNo
}

const deleteAddListMethodsParms = ref('')

const deleteAddListMethods = async () => {
  const result = await DeleteTheCurrentRowData(deleteAddListMethodsParms.value)
  if (result.code === 200) {
    deleteAddListMethodsParms.value = ''
    InsoleSendingAndReceivingQueryMethods()
    JMessage.success(result.message)
  } else {
    deleteAddListMethodsParms.value = ''
    InsoleSendingAndReceivingQueryMethods()
    JMessage.error(result.message)
  }
}

const handleCloseMateriaLKlc5 = (_done?: () => void) => {
  ElMessageBox.confirm('确认要删除数据吗?')
    .then(async () => {
      deleteAddListMethods()
    })
    .catch(() => {})
}

// 厂商获取
const EvaluatesTheArrayReturnValue = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      value: item,
      label: item
    }
  })
}

const GetVendorListListParmsMethods = ref<GetVendorListListParms>({
  pageNum: 1,
  pageSize: 999
})

const GetVendorListMethodsTableDateList = ref([])

const GetVendorListMethods = async () => {
  let NewArray = []
  const result = await VendorData1()
  NewArray = result.list.reduce((arr: any, item: any) => {
    if (item.vendorNo && item.vendorName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.vendorNo + ' ' + item.vendorName)
    }
    return arr
  }, [])
  GetVendorListMethodsTableDateList.value = EvaluatesTheArrayReturnValue(NewArray)
  AddedAllIncomingMaterialsMehtodsPamrs.value.deptName.options = GetVendorListMethodsTableDateList.value
  totalList.value = result.total
  GetVendorListMethodsTableDateList.value.forEach((item: any) => {
    tableHeader.value[0].options.push(item)
  })
  // selectListShow(listValueL.value, true)
}

const totalList = ref(0)

// 点击哪个 获取到哪个下拉框
const listValueL = ref()

// const selectListShow = (row?: any, visible?: boolean) => {
//   listValueL.value = row
//   if (visible === true) {
//     if (row !== undefined) {
//       row.deptName = {
//         selectValue: row.deptName.selectValue,
//         options: GetVendorListMethodsTableDateList.value,
//         PageModule: true,
//         total: totalList,
//         handleSizeChange: (val: any) => {
//           GetVendorListListParmsMethods.value.pageNum = val
//           GetVendorListMethods()
//         },
//         handleCurrentChange: (val: any) => {
//           GetVendorListListParmsMethods.value.pageNum = val
//           GetVendorListMethods()
//         }
//       }
//     }
//   } else {
//     if (row.deptNmae === Object) {
//       row.deptName.options = []
//     }
//   }
// }

const selectValChange = (row: any) => {
  console.log(row)
  if (activeList.value === 1) {
    for (let i = 1; i <= 26; i++) {
      if (row['qty' + i] !== '') {
        row['qty' + i] = Number(row['qty' + i])
      }
    }
    let rowList = row.deptName.split(' ')
    row.deptName = rowList[1]
    row.deptNo = rowList[0]
    AddedAllIncomingMaterialsMehtods()
  } else {
    tableHeaderList5.value[0] = { label: '客户号码' }
    tableHeader2.value = [
      {
        label: '',
        prop: 'label',
        width: '80'
      }
    ]
    let rowList = row.deptName.split(' ')
    row.deptName = rowList[1]
    row.deptNo = rowList[0]
    confirmChange(row)
  }
}

const activeList = ref()

// 新增全部收料
const AddedAllIncomingMaterialsMehtodsPamrs = ref<AddedAllIncomingMaterialsParms>({
  lotNo: '',
  deptNo: '',
  deptName: {
    selectValue: '',
    options: [],
    PageModule: true,
    total: totalList,
    handleSizeChange: (val: any) => {
      GetVendorListListParmsMethods.value.pageNum = val
      GetVendorListMethods()
    },
    handleCurrentChange: (val: any) => {
      GetVendorListListParmsMethods.value.pageNum = val
      GetVendorListMethods()
    }
  },
  slipDate: slipDate,
  qty1: '',
  qty2: '',
  qty3: '',
  qty4: '',
  qty5: '',
  qty6: '',
  qty7: '',
  qty8: '',
  qty9: '',
  qty10: '',
  qty11: '',
  qty12: '',
  qty13: '',
  qty14: '',
  qty15: '',
  qty16: '',
  qty17: '',
  qty18: '',
  qty19: '',
  qty20: '',
  qty21: '',
  qty22: '',
  qty23: '',
  qty24: '',
  qty25: '',
  qty26: '',
  remark: '',
  sendNo: '',
  slipNo: '',
  slipType: '',
  change: true,
  disableConfirm: true
})

const AddedAllIncomingMaterialsMehtods = async () => {
  const result = await AddedAllIncomingMaterials(AddedAllIncomingMaterialsMehtodsPamrs.value, TableDateListMaterials.value.size.length)
  if (result.code === 200) {
    InsoleSendingAndReceivingQueryMethods()
    activeList.value = 0
    JMessage.success(result.message)
  } else {
    InsoleSendingAndReceivingQueryMethods()
    activeList.value = 0
    JMessage.error(result.message)
  }
}

const confirmChange = async (row?: any) => {
  row.deptName = row.deptName
  row.lotNo = MaterialsReceivedAndIssuedInquiriesMethdosTableDateList.value

  for (let i = 1; i <= 26; i++) {
    if (typeof row['qty' + i] === 'string') {
      row['qty' + i] = Number(row['qty' + i])
    }
  }
  const result = await LoginWork.put<any, any>(`/pcFactorStockQuery/soleXDIOUp`, row)
  if (result.code === 200) {
    InsoleSendingAndReceivingQueryMethods()
    JMessage.success(result.message)
  } else {
    InsoleSendingAndReceivingQueryMethods()
    JMessage.error(result.message)
  }

  tableHeaderList5.value[0] = { label: '客户号码' }
  tableHeader2.value = [
    {
      label: '',
      prop: 'label',
      width: '80'
    }
  ]
}

// 鞋垫收发料查询
const Launchform = (row: any) => {
  MaterialsReceivedAndIssuedInquiriesMethdosTableDateList.value = row[0].inputValue
  AddedAllIncomingMaterialsMehtodsPamrs.value.lotNo = row[0].inputValue
  AddedAllIncomingMaterialsMehtodsPamrsOut.value.lotNo = row[0].inputValue
  GenerateDocumentNumberMethodsLotNo.value = row[0].inputValue
}

const TableDateListMaterials = ref<MaterialsReceivedAndIssuedInquiriesInterface>({
  inDtos: [],
  size: [],
  style: {},
  outDtos: [],
  sizeTotal: []
})

const MaterialsReceivedAndIssuedInquiriesMethdosTableDateList = ref('')

// 计算表格总和
const CalculatedSum = (ArrayList: any, index: string): string => {
  if (index === 'qty27' || index === 'qty28') {
    return '0'
  } else if (index === '') {
    return '0'
  } else {
    let num = ArrayList.reduce((item: number, _index: any) => {
      Number(_index)
      item += _index[index]
      return item
    }, 0)
    return num
  }
}

const InsoleSendingAndReceivingQueryMethods = async () => {
  tableHeader2.value = []
  const result = await InsoleSendingAndReceivingQuery(MaterialsReceivedAndIssuedInquiriesMethdosTableDateList.value)
  if (result.code === 200) {
    tableHeader.value.forEach((item: any) => {
      if (item.children !== undefined) {
        // item.children[0].disable = false
      }
    })
    const list = result.data.size.map((item: any, index: number) => {
      const list = Object.keys(item)
      return list
    })

    const keysArray = result.data.size.map((item: any) => {
      return Object.keys(item)
    })

    const keysArrayList = result.data.size.map((item: any) => {
      return Object.values(item)
    })

    TableDateListMaterials.value.inDtos = result.data.inDtos.map((item: any, index: number) => {
      // item.deptName = {
      //   selectValue: item.deptName || '',
      //   options: []
      // }
      item.disableConfirm = true
      item.change = true
      // item.disable = true
      return item
    })
    TableDateListMaterials.value.size = result.data.size

    list.forEach((item: any, index: number) => {
      tableHeaderList5.value[0]['qty' + [index]] = item[0]
      tableHeaderList5.value[1]['qty' + [index]] = item[0]
      tableHeader2.value.push({
        label: '',
        prop: ('qty' + [index]) as string,
        width: '80'
      })
    })

    TableDateListMaterials.value.style = result.data.style
    TableDateListMaterials.value.outDtos = result.data.outDtos.map((item: any) => {
      item.deptNo = {
        selectValue: item.deptName + ' ' + item.deptNo || '',
        options: []
      }
      item.disableConfirm = true
      item.change = true
      // item.disable = true
      return item
    })

    formList1.value[1].inputValue = result.data.style.style
    formList1.value[2].inputValue = result.data.style.color
    formList1.value[3].inputValue = result.data.style.deliveryDate
    formList1.value[4].inputValue = result.data.style.qty

    let falg = 0
    let falg1 = 0

    let falg6 = 0
    let falg5 = 0

    tableHeader.value.forEach((item1: any, index1: number) => {
      if (index1 > 2 && index1 < tableHeader.value.length - 3) {
        item1.label = keysArray[falg++]
        item1.children[0].label = keysArrayList[falg1++]
      }
    })

    tableHeader6.value.forEach((item1: any, index1: number) => {
      if (index1 > 1 && index1 < tableHeader.value.length - 3 && item1.children !== undefined) {
        item1.label = keysArray[falg6++]
        item1.children[0].label = keysArrayList[falg5++]
      }
    })

    const kesyArrayList = result.data.sizeTotal.map((item: any) => {
      return Object.values(item)
    })

    if (result.data.inDtos.length > 0) {
      let list = 0
      for (let i = 1; i <= 28; i++) {
        tableHeaderList.value[0]['num' + i] = CalculatedSum(result.data.inDtos, `qty${i}`)
      }

      for (let i = 1; i <= 28; i++) {
        if (list < kesyArrayList.length) {
          tableHeaderList.value[1]['num' + i] = Number(kesyArrayList[list++]) - Number(tableHeaderList.value[0]['num' + i])
        } else {
          tableHeaderList.value[1]['num' + i] = 0 - Number(tableHeaderList.value[0]['num' + i])
        }
      }

      tableHeaderList.value[0].num28 = CalculatedSum(result.data.inDtos, 'ttlQty')

      tableHeaderList.value[1].num28 = Object.values(tableHeaderList.value[1]).reduce((item: number, _index: any) => {
        if (_index !== '收料欠数' && !isNaN(Number(_index))) {
          item += Number(_index)
        }
        return item
      }, 0)

      list = 0
    } else {
      for (let i = 1; i <= 29; i++) {
        if (keysArrayList[i - 1]) {
          tableHeaderList.value[0]['num' + i] = 0
          tableHeaderList.value[1]['num' + i] = keysArrayList[i - 1][0]
        }
      }
    }

    if (result.data.outDtos.length > 0) {
      let list = 0
      for (let i = 1; i <= 28; i++) {
        tableHeaderList1.value[0]['num' + i] = CalculatedSum(result.data.outDtos, `qty${i}`)
      }

      for (let i = 1; i <= 28; i++) {
        if (list < kesyArrayList.length) {
          tableHeaderList1.value[1]['num' + i] = Number(kesyArrayList[list++]) - Number(tableHeaderList1.value[0]['num' + i])
        } else {
          tableHeaderList1.value[1]['num' + i] = 0 - Number(tableHeaderList1.value[0]['num' + i])
        }
      }

      tableHeaderList1.value[0].num28 = CalculatedSum(result.data.outDtos, 'ttlQty')

      tableHeaderList1.value[1].num28 = Object.values(tableHeaderList1.value[1]).reduce((item: number, _index: any) => {
        if (_index !== '收料欠数' && !isNaN(Number(_index))) {
          item += Number(_index)
        }
        return item
      }, 0)

      list = 0
    } else {
      for (let i = 1; i <= 29; i++) {
        if (keysArrayList[i - 1]) {
          tableHeaderList1.value[0]['num' + i] = 0
          tableHeaderList1.value[1]['num' + i] = keysArrayList[i - 1][0]
        }
      }
    }

    for (let i = 1; i <= 28; i++) {
      tableHeaderList1.value[2]['num' + i] = Math.abs(Number(tableHeaderList.value[0]['num' + i]) - Number(tableHeaderList1.value[0]['num' + i]))
    }

    tableHeaderList1.value[2].num29 = Math.abs(Number(tableHeaderList.value[0].num29) - Number(tableHeaderList1.value[0].num29))

    let sumList = 3

    for (let i = 0; i < result.data.inDtos.length; i++) {
      for (let K = 1; K <= 26; K++) {
        if (result.data.inDtos[i]['qty' + K] !== null && result.data.inDtos[i]['qty' + K] !== undefined) {
          if (K <= keysArrayList.length) {
            if (tableHeaderList.value[1]['num' + K] === 0 && tableHeaderList.value[1]['num' + K] !== '') {
              // if (tableHeader.value[sumList]) tableHeader.value[K + 2].children[0].disable = true
              sumList++
            }
          }
        }
      }
    }

    let sumList1 = 2

    for (let i = 0; i < result.data.outDtos.length; i++) {
      for (let K = 1; K <= 26; K++) {
        if (result.data.outDtos[i]['qty' + K] !== null && result.data.outDtos[i]['qty' + K] !== undefined) {
          if (K <= keysArrayList.length) {
            if (tableHeaderList1.value[1]['num' + K] === 0 && tableHeaderList1.value[1]['num' + K] !== '') {
              // if (tableHeader6.value[sumList]) tableHeader6.value[K + 1].children[0].disable = true
              sumList1++
            }
          }
        }
      }
    }

    sumList = 3
    sumList1 = 2
  } else {
    JMessage.error('指令无效')
  }
}

// 表格数据
const tableHeader = ref([
  {
    label: '厂商',
    prop: 'deptName',
    type: 'selectV2',
    options: []
  },
  {
    label: '收料日期',
    prop: 'slipDate',
    type: 'dateSingle'
  },
  {
    label: '送货单号',
    prop: 'sendNo'
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty1'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty2'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty3'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty4'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty5'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty6'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty7'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty8'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty9'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty10'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty11'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty12'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty13'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty14'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty15'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty16'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty17'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty18'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty19'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty20'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty21'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty22'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty23'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty24'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty26'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty26'
      }
    ]
  },
  {
    label: '合计',
    prop: 'ttlQty',
    change: 'true'
  },
  {
    label: '备注',
    prop: 'remark'
  },
  {
    label: '入库单号',
    prop: 'printNo'
  }
]) as any

const tableHeader6 = ref([
  {
    label: '领用单位',
    prop: 'deptNo',
    type: 'select'
  },
  {
    label: '发料日期',
    prop: 'slipDate',
    type: 'dateSingle'
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty1'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty2'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty3'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty4'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty5'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty6'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty7'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty8'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty9'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty10'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty11'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty12'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty13'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty14'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty15'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty16'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty17'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty18'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty19'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty20'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty21'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty22'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty23'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty24'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty26'
      }
    ]
  },
  {
    Multistage: true,
    label: '',
    children: [
      {
        label: '',
        prop: 'qty26'
      }
    ]
  },
  {
    label: '合计',
    prop: 'ttlQty',
    change: 'true'
  },
  {
    label: '备注',
    prop: 'remark'
  },
  {
    label: '入库单号',
    prop: 'slipNo'
  }
]) as any

const tableHeader2 = ref([
  {
    label: '',
    prop: 'label',
    width: '80'
  }
])

const tableHeader5 = ref([
  {
    label: '',
    prop: 'label',
    width: '240'
  },
  {
    label: '',
    prop: 'num1'
  },
  {
    label: '',
    prop: 'num2'
  },
  {
    label: '',
    prop: 'num3'
  },
  {
    label: '',
    prop: 'num4'
  },
  {
    label: '',
    prop: 'num5'
  },
  {
    label: '',
    prop: 'num6'
  },
  {
    label: '',
    prop: 'num7'
  },
  {
    label: '',
    prop: 'num8'
  },
  {
    label: '',
    prop: 'num9'
  },
  {
    label: '',
    prop: 'num10'
  },
  {
    label: '',
    prop: 'num11'
  },
  {
    label: '',
    prop: 'num12'
  },
  {
    label: '',
    prop: 'num13'
  },
  {
    label: '',
    prop: 'num14'
  },
  {
    label: '',
    prop: 'num15'
  },
  {
    label: '',
    prop: 'num16'
  },
  {
    label: '',
    prop: 'num17'
  },
  {
    label: '',
    prop: 'num18'
  },
  {
    label: '',
    prop: 'num19'
  },
  {
    label: '',
    prop: 'num20'
  },
  {
    label: '',
    prop: 'num21'
  },
  {
    label: '',
    prop: 'num22'
  },
  {
    label: '',
    prop: 'num23'
  },
  {
    label: '',
    prop: 'num24'
  },
  {
    label: '',
    prop: 'num25'
  },
  {
    label: '',
    prop: 'num26'
  },
  {
    label: '',
    prop: 'num27'
  },
  {
    label: '',
    prop: 'num28'
  },

  {
    label: '',
    prop: 'num29'
  },
  {
    label: '',
    prop: 'num30'
  }
])

const tableHeader7 = ref([
  {
    label: '指令',
    prop: 'lotNo',
    width: '160'
  }
])

const tableHeader3 = ref([
  {
    label: '',
    prop: 'label',
    width: '160'
  },
  {
    label: '',
    prop: 'num1'
  },
  {
    label: '',
    prop: 'num2'
  },
  {
    label: '',
    prop: 'num3'
  },
  {
    label: '',
    prop: 'num4'
  },
  {
    label: '',
    prop: 'num5'
  },
  {
    label: '',
    prop: 'num6'
  },
  {
    label: '',
    prop: 'num7'
  },
  {
    label: '',
    prop: 'num8'
  },
  {
    label: '',
    prop: 'num9'
  },
  {
    label: '',
    prop: 'num10'
  },
  {
    label: '',
    prop: 'num11'
  },
  {
    label: '',
    prop: 'num12'
  },
  {
    label: '',
    prop: 'num13'
  },
  {
    label: '',
    prop: 'num14'
  },
  {
    label: '',
    prop: 'num15'
  },
  {
    label: '',
    prop: 'num16'
  },
  {
    label: '',
    prop: 'num17'
  },
  {
    label: '',
    prop: 'num18'
  },
  {
    label: '',
    prop: 'num19'
  },
  {
    label: '',
    prop: 'num20'
  },
  {
    label: '',
    prop: 'num21'
  },
  {
    label: '',
    prop: 'num22'
  },
  {
    label: '',
    prop: 'num23'
  },
  {
    label: '',
    prop: 'num24'
  },
  {
    label: '',
    prop: 'num25'
  },
  {
    label: '',
    prop: 'num26'
  },
  {
    label: '',
    prop: 'num27'
  },
  {
    label: '',
    prop: 'num28'
  },

  {
    label: '',
    prop: 'num29'
  },
  {
    label: '',
    prop: 'num30'
  }
])
</script>

<style lang="less" scoped>
h1 {
  font-size: 16px;
}
</style>
